/**
 * @author Klas
 */

var validering = {

    init: function () {
		
		var form = document.getElementById("regformularet");

        var userName = document.getElementById("username");
        var eMail = document.getElementById ("email");
        var passWord = document.getElementById("password");
        var passWord2 = document.getElementById("verifierapassword");
        var ryHuman = document.getElementById("human");
		
     // Focusfunktionen
		// vid fokus visa tooltippet
        //Username
        userName.onfocus = function () {
            // skapa divtaggen
            var divTag = document.createElement("div");
            divTag.className = "tooltip";
            document.body.appendChild(divTag);

            var text = document.createTextNode("Giltiga tecken är: a-z och 0-9. Blanda gärna, dock ej enbart siffror"); 
            divTag.appendChild(text);

            var pos = validering.findPos(this);
            divTag.style.left = pos[0] + 185 + "px";
            divTag.style.top = pos[1] + "px";

            // Ta bort Tooltippet (divtaggen)
            userName.onblur = function () {
                document.body.removeChild(divTag);
            };
        };
        
        //Email
         eMail.onfocus = function () {
            // skapa divtaggen
            var divTag = document.createElement("div");
            divTag.className = "tooltip";
            document.body.appendChild(divTag);

            var text = document.createTextNode("Ange en äkta E-postadress");
            divTag.appendChild(text);

            var pos = validering.findPos(this);
            divTag.style.left = pos[0] + 185 + "px";
            divTag.style.top = pos[1] + "px";

            // Ta bort divtaggen
            eMail.onblur = function () {
                document.body.removeChild(divTag);
            };
        };
        

        //Password
        passWord.onfocus = function () {
            // skapa divtaggen
            var divTag = document.createElement("div");
            divTag.className = "tooltip";
            document.body.appendChild(divTag);

            var text = document.createTextNode("Giltiga tecken är: a-z och 0-9. Lösenordet måste bestå av minst sex tecken");
            divTag.appendChild(text);

            var pos = validering.findPos(this);
            divTag.style.left = pos[0] + 185 + "px";
            divTag.style.top = pos[1] +"px";

            // Ta bort divtaggen
            passWord.onblur = function () {
                document.body.removeChild(divTag);
            };
            
         };
               
         //Password2
        passWord2.onfocus = function () {
            // skapa divtaggen
            var divTag = document.createElement("div");
            divTag.className = "tooltip";
            document.body.appendChild(divTag);

            var text = document.createTextNode("Var vänlig repetera lösenordet");
            divTag.appendChild(text);

            var pos = validering.findPos(this);
            divTag.style.left = pos[0] + 185 + "px";
            divTag.style.top = pos[1] + "px";

            // Ta bort divtaggen
            passWord2.onblur = function () {
                document.body.removeChild(divTag);
            };
        };
        
        //Are you human
       	ryHuman.onfocus = function () {
            // skapa divtaggen
            var divTag = document.createElement("div");
            divTag.className = "tooltip";
            document.body.appendChild(divTag);

            var text = document.createTextNode("Bevisa att du är mänsklig. Vad är 1+1?");
            divTag.appendChild(text);

            var pos = validering.findPos(this);
            divTag.style.left = pos[0] + 185 + "px";
            divTag.style.top = pos[1] + "px";

            // Ta bort divtaggen
            ryHuman.onblur = function () {
                document.body.removeChild(divTag);
            };
        };
        
      },

    // funktion för att positionera tooltippet
    findPos: function (obj) {
        var curleft = curtop = 0;
        if (obj.offsetParent) {
            do {
                curleft += obj.offsetLeft;
                curtop += obj.offsetTop;
            }
            while (obj = obj.offsetParent);
            return [curleft, curtop];
        }

    }

};

window.onload = validering.init;